@import (reference) "./../../shared/common";
@import (reference) "./../../shared/color";
@import "./../../tab-list/tab-list.component.less";

.quote-overview {
  // padding: @space-common;
  .bottom-zone,
  .brief-zone {
    // margin-top: @space-common;
    border-top: @border-simple-dark;
  }
  .bottom-zone {
    background-color: @color-white;
  }
  .chart-zone {
    .display-flex(row);
    background-color: @color-white;
    .chart-zone-item {
      height: 100%;
      width: 5px;
      .display-flex;
      .flex;

      &+.chart-zone-item {
        border-left: 1px solid @color-gray-main;
      }
    }
    .chart-zone-title {
      font-size: 1.4rem;
      margin: 0;
      padding: 0 @space-common;
    }
    quote-chart {
      .display-flex;
      .flex-grow(1);
      width: 100%;
      height: 5px;
    }
    
    // quote-chart {
    //   width: 5px;
    //   flex-grow: 1;
    //   +quote-chart {
    //     // margin-left: @space-common;
    //   }
    // }
  }
  // 高度部分
  height: calc(~"100% - 36px");
  .chart-zone {
    height: 29.0595%;
    .quote-chart {
      height: 100%;
    }
  }
  .bottom-zone {
    height: 41.985%;
    padding: @space-common;
  }
  .brief-zone {
    height: 28.9555%;
    overflow: hidden;
  }
}